import 'dart:math';

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:spree/utils/utils.dart';
import 'package:spree/widgets/common_container.dart';
import 'package:spree/widgets/vip_rectangle_box.dart';

import '../../../provider/model/user_model.dart';
import '../../../utils/api.dart';
import '../../../widgets/copty_input.dart';
import '../../../widgets/vip_content_box.dart';

class ToInvite extends StatefulWidget {
  ToInvite({Key? key}) : super(key: key);

  @override
  State<ToInvite> createState() => _ToInviteState();
}

class _ToInviteState extends State<ToInvite> {
  List<Widget> inviteRewardRule = [];
  List<Widget> inviteRewardRulePerPerson = [];
  List<Widget> inviteGiveBackRule = [];
  int gusetUsers = 0;
  int depositUsers = 0;
  String bonusToday = '';
  String yesterdayBonus = '';
  String ownInvitationCode = '';
  String firstLevelGivePercent = '';
  String secondLevelGivePercent = '';
  String thirdLevelGivePercent = '';
  String firstInviteBonus = '';
  String secondInviteBonus = '';
  String thirdInviteBonus = '';
  String invitationBonus = '';
  String bettingCommission = '';

  @override
  void initState() {
    initData();
    // TODO: implement initState
    super.initState();
  }

  initData() async {
    String? userId = context.read<UserModel>().userId;
    if (userId != '') {
      dynamic result = await Api.inviteStaticsInfo();
      dynamic data = result['data'];
      ownInvitationCode = data['ownInvitationCode'];
      gusetUsers = data['guestUser'];
      depositUsers = data['depositeUser'];
      bonusToday = data['bonusToday'];
      yesterdayBonus = data['yesterdayBonus'];
      invitationBonus = data['invitationBonus'];
      bettingCommission = data['bettingCommission'];
      setState(() {});
      print(result);
    }
    initInviteGiveBackRule();
    initInviteRewardRule();
  }

  initInviteGiveBackRule() async {
    dynamic inviteGiveBackRule = await Api.inviteGiveBackRule();
    List result = inviteGiveBackRule['data'];
    firstLevelGivePercent = result[0]['giveRate'];
    secondLevelGivePercent = result[1]['giveRate'];
    thirdLevelGivePercent = result[2]['giveRate'];
    firstInviteBonus = (double.parse(firstLevelGivePercent) * 100).toString();
    secondInviteBonus = (double.parse(secondLevelGivePercent) * 100).toString();
    thirdInviteBonus = (double.parse(thirdLevelGivePercent) * 100).toString();
    setState(() {});
  }

  initInviteRewardRule() async {
    dynamic depositRewardRule = await Api.depositRewardRule();
    List result = depositRewardRule['data'];
    //组装前面的规则
    inviteRewardRule.add(Container(
      margin: EdgeInsets.only(left: 10, right: 10),
      child: _cardText(
          height: 70,
          isTile: true,
          line1: 'Cumulative Deposit',
          line2: 'Users'),
    ));
    //组装后面的金额
    inviteRewardRulePerPerson.add(Container(
      margin: EdgeInsets.only(left: 10, right: 10),
      child: _cardText(
        height: 70,
        isTile: true,
        line1: 'Bonus',
      ),
    ));
    for (int i = 0; i < result.length; i++) {
      int minNumber = result[i]['minNumber'];
      int maxNumber = result[i]['maxNumber'];
      String title = '$minNumber-$maxNumber';
      if (i == result.length - 1) {
        title = 'More than $minNumber';
      }
      double rewardPerPeople =
          double.parse(result[i]['rewardPerPeople'].toString());

      inviteRewardRule.add(Container(
        margin: EdgeInsets.only(left: 10, right: 10),
        padding: EdgeInsets.only(top: 10),
        child: _cardText(isTile: false, line1: title, line2: 'People'),
      ));

      inviteRewardRulePerPerson.add(Container(
        margin: EdgeInsets.only(left: 10, right: 10),
        padding: EdgeInsets.only(top: 10),
        child: _cardText(
            isTile: false, line1: 'R\$ $rewardPerPeople', line2: 'Per People'),
      ));
    }
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        VipContentBox(
          padding: EdgeInsets.only(top: 0),
          child: Column(
            children: [
              Container(
                padding: EdgeInsets.all(10),
                decoration: BoxDecoration(
                  color: Color(0xFF4928A5),
                  borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(8),
                    topRight: Radius.circular(8),
                  ),
                ),
                child: Column(
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: [
                        Column(
                          children: [
                            Text(
                              'Guest Users',
                              style: TextStyle(
                                  color: Color(0xFFFFED4A), fontSize: 10),
                            ),
                            Padding(
                              padding: EdgeInsets.only(top: 4),
                              child: Text(
                                '$gusetUsers',
                                style: TextStyle(
                                    color: Colors.white, fontSize: 10),
                              ),
                            ),
                          ],
                        ),
                        Column(
                          children: [
                            Text(
                              'Deposited Users',
                              style: TextStyle(
                                  color: Color(0xFFFFED4A), fontSize: 10),
                            ),
                            Padding(
                              padding: EdgeInsets.only(top: 4),
                              child: Text(
                                '$depositUsers',
                                style: TextStyle(
                                    color: Colors.white, fontSize: 10),
                              ),
                            ),
                          ],
                        ),
                        Column(
                          children: [
                            Text(
                              'Bonus Today',
                              style: TextStyle(
                                  color: Color(0xFFFFED4A), fontSize: 10),
                            ),
                            Padding(
                              padding: EdgeInsets.only(top: 4),
                              child: Text(
                                '$bonusToday',
                                style: TextStyle(
                                    color: Colors.white, fontSize: 10),
                              ),
                            ),
                          ],
                        ),
                        Column(
                          children: [
                            Text(
                              "Yesterday's Bonus",
                              style: TextStyle(
                                  color: Color(0xFFFFED4A), fontSize: 10),
                            ),
                            Padding(
                              padding: EdgeInsets.only(top: 4),
                              child: Text(
                                '$yesterdayBonus',
                                style: TextStyle(
                                    color: Colors.white, fontSize: 10),
                              ),
                            ),
                          ],
                        ),
                      ],
                    ),
                  ],
                ),
              ),
              Padding(
                padding: EdgeInsets.only(top: 20, bottom: 20),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    // asset('images/fait-icon.png')
                    Image.asset(
                      'images/fait.png',
                      width: 16,
                    ),
                    Container(
                      margin: EdgeInsets.only(left: 14),
                      child: Text(
                        'Invite a Partner',
                        style: TextStyle(
                            color: Color(0xFFFFED4A),
                            fontWeight: FontWeight.w800,
                            fontSize: 16),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                padding: EdgeInsets.only(left: 10, right: 10),
                width: Utils().getScreenWidth(context),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      'Invite URL:',
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: 16,
                          fontWeight: FontWeight.w800),
                    ),
                    Container(
                      margin: EdgeInsets.only(top: 10),
                      child: CopyInput(
                        showBorder: false,
                        copyContentColor: Color(0xff362B76),
                        copyContent:
                            'https://betdino.io?referralcode=62f14645860e2bee6be9f840',
                      ),
                    )
                  ],
                ),
              ),
              Container(
                margin: EdgeInsets.only(top: 20, bottom: 20),
                padding: EdgeInsets.only(left: 10, right: 10),
                width: Utils().getScreenWidth(context),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      'Copy the invite Code:',
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: 16,
                          fontWeight: FontWeight.w800),
                    ),
                    Container(
                      margin: EdgeInsets.only(top: 10),
                      child: CopyInput(
                        showBorder: false,
                        copyContentColor: Color(0xff362B76),
                        copyContent: '$ownInvitationCode',
                      ),
                    )
                  ],
                ),
              ),
            ],
          ),
        ),
        VipContentBox(
          margin: EdgeInsets.only(top: 20),
          padding: EdgeInsets.all(10),
          width: Utils().getScreenWidth(context),
          child: _cardContent('images/crown.png',
              yellowText: 'Monthly Revenue Goals',
              whiteText2: '5 more people to invite before the goal is reached'),
        ),
        _cardContent('images/target.png',
            yellowText: 'Invitation Bonus',
            whiteText: '$invitationBonus',
            whiteText2: '8207315 Received',
            margin: EdgeInsets.only(top: 20)),
        _cardContent('images/flash.png',
            yellowText: 'Betting Commission',
            whiteText: '$bettingCommission',
            whiteText2: '8207315 Received',
            margin: EdgeInsets.only(top: 20)),
        Padding(
          padding: EdgeInsets.only(top: 20, bottom: 20),
          child: Column(
            children: [
              Text(
                'HOW DOES THE INVITATION BONUS WORK?',
                style: TextStyle(
                    color: Color(0xFFFFED4A),
                    fontSize: 15,
                    fontWeight: FontWeight.w800),
              ),
              Padding(
                padding: EdgeInsets.only(top: 10, right: 20, left: 20),
                child: Text(
                  'Each deposit user can receive at least R\$8 for each invite. The more people you invite, the greater the invite bonus for the corresponding level. For specific rules, see the table below',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 12,
                  ),
                ),
              )
            ],
          ),
        ),
        VipContentBox(
          padding: EdgeInsets.only(top: 20, right: 10, left: 10, bottom: 20),
          width: Utils().getScreenWidth(context),
          child: VipRectangleBox(
            padding: EdgeInsets.only(top: 20, bottom: 20),
            width: Utils().getScreenWidth(context),
            child: Row(
              children: [
                Expanded(
                  child: Column(children: inviteRewardRule
                      // [
                      //   Container(
                      //     margin: EdgeInsets.only(left: 10, right: 10),
                      //     child: _cardText(
                      //         height: 70,
                      //         isTile: true,
                      //         line1: 'Cumulative Deposit',
                      //         line2: 'Users'),
                      //   ),
                      //   Container(
                      //     margin: EdgeInsets.only(left: 10, right: 10),
                      //     padding: EdgeInsets.only(top: 10),
                      //     child: _cardText(
                      //         isTile: false, line1: '0-999', line2: 'People'),
                      //   ),
                      //   Container(
                      //     margin: EdgeInsets.only(left: 10, right: 10),
                      //     padding: EdgeInsets.only(top: 10),
                      //     child: _cardText(
                      //         isTile: false, line1: '1000-2999', line2: 'People'),
                      //   ),
                      //   Container(
                      //     margin: EdgeInsets.only(left: 10, right: 10),
                      //     padding: EdgeInsets.only(top: 10),
                      //     child: _cardText(
                      //         isTile: false, line1: '3000-4999', line2: 'People'),
                      //   ),
                      //   Container(
                      //     margin: EdgeInsets.only(left: 10, right: 10),
                      //     padding: EdgeInsets.only(top: 10),
                      //     child: _cardText(
                      //         isTile: false,
                      //         line1: 'More than 5000',
                      //         line2: 'People'),
                      //   ),
                      // ],
                      ),
                  flex: 1,
                ),
                Expanded(
                  child: Column(children: inviteRewardRulePerPerson
                      // [
                      //   Container(
                      //     margin: EdgeInsets.only(left: 10, right: 10),
                      //     child: _cardText(
                      //       height: 70,
                      //       isTile: true,
                      //       line1: 'Bonus',
                      //     ),
                      //   ),
                      //   Container(
                      //     margin: EdgeInsets.only(left: 10, right: 10),
                      //     padding: EdgeInsets.only(top: 10),
                      //     child: _cardText(
                      //         isTile: false, line1: 'R\$ 9', line2: 'Per People'),
                      //   ),
                      //   Container(
                      //     margin: EdgeInsets.only(left: 10, right: 10),
                      //     padding: EdgeInsets.only(top: 10),
                      //     child: _cardText(
                      //         isTile: false, line1: 'R\$10', line2: 'Per People'),
                      //   ),
                      //   Container(
                      //     margin: EdgeInsets.only(left: 10, right: 10),
                      //     padding: EdgeInsets.only(top: 10),
                      //     child: _cardText(
                      //         isTile: false, line1: 'R\$12', line2: 'Per People'),
                      //   ),
                      //   Container(
                      //     margin: EdgeInsets.only(left: 10, right: 10),
                      //     padding: EdgeInsets.only(top: 10),
                      //     child: _cardText(
                      //         isTile: false, line1: 'R\$15', line2: 'Per People'),
                      //   ),
                      // ],
                      ),
                  flex: 1,
                )
              ],
            ),
          ),
        ),
        Padding(
          padding: EdgeInsets.only(top: 20, bottom: 20),
          child: Column(
            children: [
              Text(
                'HOW TO GET COMMISSION ON YOUR BETS',
                style: TextStyle(
                    color: Color(0xFFFFED4A),
                    fontSize: 15,
                    fontWeight: FontWeight.w800),
              ),
              Padding(
                padding: EdgeInsets.only(top: 10, right: 20, left: 20),
                child: Text(
                  'This will be your long-term income and you will receive a different percentage of commission each time a player you invite places a bet.',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 12,
                  ),
                ),
              )
            ],
          ),
        ),
        _cardContent('images/money-bag.png',
            yellowText: 'Invite Rules: ',
            whiteText2:
                'Valid invite level can reach level 3, and the wager discount reward is Level 1- $firstLevelGivePercent%;  Level 2- $secondLevelGivePercent%; Level 3- $thirdLevelGivePercent%. Reward Issuance Time: Real-time settlement and issuance',
            margin: EdgeInsets.only(top: 20)),
        _cardContent('images/travel-guide-book.png',
            yellowText: 'Invite Rules: ',
            whiteText2:
                'the invite ratio is A invite B, B invite C, C invite D, D invite E. When E bets 10,000R\$',
            whiteText3:
                '※ D can get 10000 * $firstLevelGivePercent% = $firstInviteBonus R\$',
            whiteText4:
                '※ C can get 10000 * $secondLevelGivePercent% = $secondInviteBonus R\$',
            whiteText5:
                '※ B can get 10000 * $thirdLevelGivePercent% = $thirdInviteBonus R\$',
            whiteText6: '※ A has no return in three Levels.',
            margin: EdgeInsets.only(top: 20)),
        VipContentBox(
          padding: EdgeInsets.all(20),
          margin: EdgeInsets.only(top: 20),
          child: Image.asset('images/group-level.png'),
        ),
        VipContentBox(
          margin: EdgeInsets.only(top: 20),
          width: Utils().getScreenWidth(context),
          child: Column(
            children: [
              Text(
                'Income Calculator',
                style: TextStyle(
                    color: Colors.white,
                    fontSize: 16,
                    fontWeight: FontWeight.w800),
              ),
              Padding(
                padding: EdgeInsets.only(top: 20, bottom: 20),
                child: Text(
                  'R\$ 0',
                  style: TextStyle(
                      color: Color(0xFFFFED4A),
                      fontSize: 32,
                      fontWeight: FontWeight.w800),
                ),
              ),
              Padding(
                padding: EdgeInsets.only(bottom: 20),
                child: Text(
                  'Invite 0 Users assets Expected annual income to be earned',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 12,
                  ),
                ),
              ),
              Slider(
                value: 0,
                max: 100,
                activeColor: Color(0xFFFFED4A),
                onChanged: (double value) {
                  setState(() {
                    // _currentSliderValue = value;
                  });
                },
              ),
            ],
          ),
        ),
        Container(
          width: Utils().getScreenWidth(context),
          padding: EdgeInsets.all(10),
          margin: EdgeInsets.only(top: 20),
          decoration: BoxDecoration(
            borderRadius: const BorderRadius.all(Radius.circular(8.0)),
            gradient: LinearGradient(
              colors: [Color(0xFF281B73), Color(0xFF8458FF)],
              begin: Alignment.topLeft,
              end: Alignment.bottomRight,
            ),
          ),
          child: Column(
            children: [
              Text(
                'Leaderboard',
                style: TextStyle(
                    fontSize: 22,
                    fontWeight: FontWeight.w800,
                    color: Color(0xFFFFED4A)),
              ),
              Container(
                margin: EdgeInsets.only(top: 20),
                width: Utils().getScreenWidth(context),
                alignment: Alignment.center,
                child: Stack(
                  children: [
                    Container(
                      width: Utils().getScreenWidth(context),
                      height: 200,
                      child: Column(
                        children: [
                          Text(
                            'TOP 1',
                            style: TextStyle(
                                color: Color(0xFFFFCC00),
                                fontWeight: FontWeight.w800),
                          ),
                          ClipOval(
                              child: Image.asset(
                            'images/avatar.jpg',
                            width: 50,
                            fit: BoxFit.cover,
                          )),
                          Padding(
                            padding: EdgeInsets.only(top: 10),
                            child: Text(
                              'User720769654',
                              style:
                                  TextStyle(color: Colors.white, fontSize: 12),
                            ),
                          ),
                          Padding(
                            padding: EdgeInsets.only(top: 4),
                            child: Text(
                              'R\$ 17201880',
                              style:
                                  TextStyle(color: Colors.white, fontSize: 12),
                            ),
                          )
                        ],
                      ),
                    ),
                    Positioned(
                        left: 10,
                        top: 60,
                        child: Column(
                          children: [
                            Text(
                              'TOP 2',
                              style: TextStyle(
                                  color: Color(0xFF31C5E5),
                                  fontWeight: FontWeight.w800),
                            ),
                            ClipOval(
                                child: Image.asset(
                              'images/avatar.jpg',
                              width: 50,
                              fit: BoxFit.cover,
                            )),
                            Padding(
                              padding: EdgeInsets.only(top: 10),
                              child: Text(
                                'User720769654',
                                style: TextStyle(
                                    color: Colors.white, fontSize: 12),
                              ),
                            ),
                            Padding(
                              padding: EdgeInsets.only(top: 4),
                              child: Text(
                                'R\$ 17201880',
                                style: TextStyle(
                                    color: Colors.white, fontSize: 12),
                              ),
                            )
                          ],
                        )),
                    Positioned(
                        right: 10,
                        top: 70,
                        child: Column(
                          children: [
                            Text(
                              'TOP 3',
                              style: TextStyle(
                                  color: Color(0xFFE5A831),
                                  fontWeight: FontWeight.w800),
                            ),
                            ClipOval(
                                child: Image.asset(
                              'images/avatar.jpg',
                              width: 50,
                              fit: BoxFit.cover,
                            )),
                            Padding(
                              padding: EdgeInsets.only(top: 10),
                              child: Text(
                                'User720769654',
                                style: TextStyle(
                                    color: Colors.white, fontSize: 12),
                              ),
                            ),
                            Padding(
                              padding: EdgeInsets.only(top: 4),
                              child: Text(
                                'R\$ 17201880',
                                style: TextStyle(
                                    color: Colors.white, fontSize: 12),
                              ),
                            )
                          ],
                        ))
                  ],
                ),
              )
            ],
          ),
        ),
        Container(
          width: Utils().getScreenWidth(context),
          padding: EdgeInsets.all(10),
          margin: EdgeInsets.only(top: 20),
          decoration: BoxDecoration(
            borderRadius: const BorderRadius.all(Radius.circular(8.0)),
            gradient: LinearGradient(
              colors: [Color(0xFF281B73), Color(0xFF8458FF)],
              begin: Alignment.topLeft,
              end: Alignment.bottomRight,
            ),
          ),
          child: Column(
            children: [
              Text(
                'Who Won the Prize',
                style: TextStyle(
                    color: Color(0xFFFFED4A),
                    fontSize: 22,
                    fontWeight: FontWeight.w800),
              ),
              CommonContainer(
                showBorderRadius: true,
                padding: EdgeInsets.all(12),
                margin: EdgeInsets.only(top: 10),
                child: Row(
                  children: [
                    Expanded(
                      child: Text(
                        'User738006430',
                        style:
                            TextStyle(color: Color(0XFFB0AFEC), fontSize: 10),
                      ),
                      flex: 2,
                    ),
                    Expanded(
                      child: Text(
                        'Receive an invite bonus',
                        style:
                            TextStyle(color: Color(0XFFB0AFEC), fontSize: 10),
                      ),
                      flex: 2,
                    ),
                    Expanded(
                      child: Text(
                        'R\$ 11',
                        style:
                            TextStyle(color: Color(0XFFFFED4A), fontSize: 10),
                      ),
                      flex: 1,
                    ),
                  ],
                ),
              ),
              CommonContainer(
                showBorderRadius: true,
                padding: EdgeInsets.all(12),
                margin: EdgeInsets.only(top: 10),
                child: Row(
                  children: [
                    Expanded(
                      child: Text(
                        'User738006430',
                        style:
                            TextStyle(color: Color(0XFFB0AFEC), fontSize: 10),
                      ),
                      flex: 2,
                    ),
                    Expanded(
                      child: Text(
                        'Receive an invite bonus',
                        style:
                            TextStyle(color: Color(0XFFB0AFEC), fontSize: 10),
                      ),
                      flex: 2,
                    ),
                    Expanded(
                      child: Text(
                        'R\$ 11',
                        style:
                            TextStyle(color: Color(0XFFFFED4A), fontSize: 10),
                      ),
                      flex: 1,
                    ),
                  ],
                ),
              ),
              CommonContainer(
                showBorderRadius: true,
                padding: EdgeInsets.all(12),
                margin: EdgeInsets.only(top: 10),
                child: Row(
                  children: [
                    Expanded(
                      child: Text(
                        'User738006430',
                        style:
                            TextStyle(color: Color(0XFFB0AFEC), fontSize: 10),
                      ),
                      flex: 2,
                    ),
                    Expanded(
                      child: Text(
                        'Receive an invite bonus',
                        style:
                            TextStyle(color: Color(0XFFB0AFEC), fontSize: 10),
                      ),
                      flex: 2,
                    ),
                    Expanded(
                      child: Text(
                        'R\$ 11',
                        style:
                            TextStyle(color: Color(0XFFFFED4A), fontSize: 10),
                      ),
                      flex: 1,
                    ),
                  ],
                ),
              ),
              CommonContainer(
                showBorderRadius: true,
                padding: EdgeInsets.all(12),
                margin: EdgeInsets.only(top: 10),
                child: Row(
                  children: [
                    Expanded(
                      child: Text(
                        'User738006430',
                        style:
                            TextStyle(color: Color(0XFFB0AFEC), fontSize: 10),
                      ),
                      flex: 2,
                    ),
                    Expanded(
                      child: Text(
                        'Receive an invite bonus',
                        style:
                            TextStyle(color: Color(0XFFB0AFEC), fontSize: 10),
                      ),
                      flex: 2,
                    ),
                    Expanded(
                      child: Text(
                        'R\$ 11',
                        style:
                            TextStyle(color: Color(0XFFFFED4A), fontSize: 10),
                      ),
                      flex: 1,
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
        _listContainer(title: '1 LEVEL USERS', data: [
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
        ]),
        _listContainer(title: '2 LEVEL USERS', data: [
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
        ]),
        _listContainer(title: '3 LEVEL USERS', data: [
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
          {'name': 'User82076', 'money': '8413570'},
        ]),
      ],
    );
  }

  _listContainer({String? title, List<Map>? data}) {
    List<Widget> dataList = [];
    if (data != null) {
      dataList = data.asMap().keys.map((i) {
        return Container(
          width: Utils().getScreenWidth(context),
          margin: EdgeInsets.only(top: 20),
          child: Row(
            children: [
              Expanded(
                flex: 1,
                child: Text(
                  '#${i + 1}',
                  style: TextStyle(color: Color(0xFFB0AFEC)),
                ),
              ),
              Expanded(
                flex: 3,
                child: Text(
                  '${data[i]['name']}',
                  style: TextStyle(color: Color(0xFFB0AFEC)),
                ),
              ),
              Expanded(
                flex: 3,
                child: Text(
                  'R\$ ${data[i]['money']}',
                  style: TextStyle(color: Color(0xFFB0AFEC)),
                ),
              ),
            ],
          ),
        );
      }).toList();
    }

    return Container(
      width: Utils().getScreenWidth(context),
      margin: EdgeInsets.only(top: 20),
      padding: EdgeInsets.all(10),
      decoration: BoxDecoration(
        color: Utils().createMaterialColor(),
        borderRadius: BorderRadius.all(Radius.circular(10.0)),
        boxShadow: [
          BoxShadow(
              color: Color(0xFF261E54),
              offset: Offset(0.0, 1.0),
              blurRadius: 1,
              spreadRadius: 2)
        ],
      ),
      child: Column(
        children: [
          Container(
            width: 150,
            alignment: Alignment.center,
            padding: EdgeInsets.all(20),
            decoration: BoxDecoration(
              color: Color(0xFF7348ED),
              borderRadius: const BorderRadius.all(Radius.circular(8.0)),
            ),
            child: Text(
              title ?? '1 LEVEL USERS',
              style: TextStyle(color: Colors.white),
            ),
          ),
          Container(
            width: Utils().getScreenWidth(context),
            margin: EdgeInsets.only(top: 20),
            child: Row(
              children: [
                Expanded(
                  flex: 1,
                  child: Text(
                    '#',
                    style: TextStyle(color: Color(0xFFB0AFEC)),
                  ),
                ),
                Expanded(
                  flex: 6,
                  child: Text(
                    'Player',
                    style: TextStyle(color: Color(0xFFB0AFEC)),
                  ),
                ),
              ],
            ),
          ),
          ...dataList
        ],
      ),
    );
  }

  _cardText(
      {String? line1, String? line2, bool isTile = false, double? height}) {
    return VipRectangleBox(
      alignment: Alignment.center,
      height: height,
      padding: EdgeInsets.all(6),
      color: Color(0xFF362B76),
      width: Utils().getScreenWidth(context),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          line1 != null
              ? Text(
                  line1,
                  textAlign: TextAlign.center,
                  style: TextStyle(
                      color: isTile ? Color(0xFFFFED4A) : Colors.white,
                      fontWeight: isTile ? FontWeight.w800 : null),
                )
              : Container(),
          line2 != null
              ? Text(
                  line2,
                  textAlign: TextAlign.center,
                  style: TextStyle(
                      color: isTile ? Color(0xFFFFED4A) : Colors.white,
                      fontWeight: isTile ? FontWeight.w800 : null),
                )
              : Container(),
        ],
      ),
    );
  }

  _cardContent(String imgPath,
      {String? yellowText = '',
      String? whiteText,
      String? whiteText2,
      String? whiteText3,
      String? whiteText4,
      String? whiteText5,
      String? whiteText6,
      EdgeInsets? margin}) {
    return Container(
      padding: EdgeInsets.all(10),
      margin: margin,
      decoration: BoxDecoration(
        borderRadius: const BorderRadius.all(Radius.circular(8.0)),
        gradient: LinearGradient(
          colors: [Color(0xFF281B73), Color(0xFF8458FF)],
          begin: Alignment.topLeft,
          end: Alignment.bottomRight,
        ),
      ),
      child: Row(
        children: [
          Expanded(
              child: Padding(
            padding: EdgeInsets.only(left: 10),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                Text(
                  yellowText ?? "",
                  style: TextStyle(
                      color: Color(0xFFFFED4A),
                      fontSize: 16,
                      fontWeight: FontWeight.w800),
                ),
                whiteText != null
                    ? Padding(
                        padding: EdgeInsets.only(top: 8),
                        child: Text(
                          whiteText,
                          style: TextStyle(
                              color: Colors.white, fontWeight: FontWeight.w800),
                        ),
                      )
                    : Container(),
                whiteText2 != null
                    ? Padding(
                        padding: EdgeInsets.only(top: 8),
                        child: Text(
                          whiteText2,
                          style: TextStyle(color: Colors.white, fontSize: 12),
                        ),
                      )
                    : Container(),
                whiteText3 != null
                    ? Padding(
                        padding: EdgeInsets.only(top: 8),
                        child: Text(
                          whiteText3,
                          style: TextStyle(color: Colors.white, fontSize: 12),
                        ),
                      )
                    : Container(),
                whiteText4 != null
                    ? Padding(
                        padding: EdgeInsets.only(top: 8),
                        child: Text(
                          whiteText4,
                          style: TextStyle(color: Colors.white, fontSize: 12),
                        ),
                      )
                    : Container(),
                whiteText5 != null
                    ? Padding(
                        padding: EdgeInsets.only(top: 8),
                        child: Text(
                          whiteText5,
                          style: TextStyle(color: Colors.white, fontSize: 12),
                        ),
                      )
                    : Container(),
                whiteText6 != null
                    ? Padding(
                        padding: EdgeInsets.only(top: 8),
                        child: Text(
                          whiteText6,
                          style: TextStyle(color: Colors.white, fontSize: 12),
                        ),
                      )
                    : Container(),
              ],
            ),
          )),
          Image.asset(
            imgPath,
            height: 108,
          )
        ],
      ),
    );
  }
}
